<!DOCTYPE html>
<html>
<head>
  <title>hAPI Console</title>
  <script type="application/javascript" src="js/hapi.js"></script>
  <script type="application/javascript" src="js/beautify.js" async="async"></script>
  <script type="application/javascript" src="js/console.js"></script>
  <link rel="stylesheet" type="text/css" href="css/console.css" />
</head>
<body>
  <div id="logout" onclick="logout()">
    Log out
  </div>
  <div id="container" hidden="true">
    <div id="console" class="box">
      <div id="console-container">
        <div id="entry">
          <select id="method" onchange="fetchDocs()">
            <option value="default">Select a Method</option>
          </select>
          <hr/>
          <div id="paramhead">Parameters <img onclick="addParam()" alt="Add" title="Add a Parameter" src="%2F9hAAAABGdBTUEAAK%2FINwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAJvSURBVDjLpZPrS5NhGIf9W7YvBYOkhlkoqCklWChv2WyKik7blnNris72bi6dus0DLZ0TDxW1odtopDs4D8MDZuLU0kXq61CijSIIasOvv94VTUfLiB74fXngup7nvrnvJABJ%2F5PfLnTTdcwOj4RsdYmo5glBWP6iOtzwvIKSWstI0Wgx80SBblpKtE9KQs%2FWe7EaWoT%2F8wbWP61gMmCH0lMDvokT4j25TiQU%2FITFkek9Ow6%2B7WH2gwsmahCPdwyw75uw9HEO2gUZSkfyI9zBPCJOoJ2SMmg46N61YO%2FrNoa39Xi41oFuXysMfh36%2FFp0b7bAfWAH6RGi0HglWNCbzYgJaFjRv6zGuy%2Bb9It96N3SQvNKiV9HvSaDfFEIxXItnPs23BzJQd6DDEVM0OKsoVwBG%2F1VMzpXVWhbkUM2K4oJBDYuGmbKIJ0qxsAbHfRLzbjcnUbFBIpx%2FqH3vQv9b3U03IQ%2FHfFkERTzfFj8w8jSpR7GBE123uFEYAzaDRIqX%2F2JAtJbDat%2FCOkd7CNBva2cMvq0MGxp0PRSCPF8BXjWG3FgNHc9XPT71Ojy3sMFdfJRCeKxEsVtKwFHwALZfCUk3tIfNR8XiJwc1LmL4dg141JPKtj3WUdNFJqLGFVPC4OkR4BxajTWsChY64wmCnMxsWPCHcutKBxMVp5mxA1S%2BaMComToaqTRUQknLTH62kHOVEE%2BVQnjahscNCy0cMBWsSI0TCQcZc5ALkEYckL5A5noWSBhfm2AecMAjbcRWV0pUTh0HE64TNf0mczcnnQyu%2FMilaFJCae1nw2fbz1DnVOxyGTlKeZft%2FFf8x1BRssfACjTwQAAAABJRU5ErkJggg%3D%3D"/></div>
          <table id="parameters" border="0">
            <tr id="template" class="param" style="display: none">
              <td><input class="pname" type="text" placeholder="Name"/></td>
              <td><input class="pvalue" type="text" placeholder="Value"/></td>
              <td><img onclick="removeParam(this)" alt="Delete" title="Remove Set" src="%2F9hAAAABGdBTUEAAK%2FINwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAJdSURBVDjLpZP7S1NhGMf9W7YfogSJboSEUVCY8zJ31trcps6zTI9bLGJpjp1hmkGNxVz4Q6ildtXKXzJNbJRaRmrXoeWx8tJOTWptnrNryre5YCYuI3rh%2B8vL%2B%2Fm8PA%2FPkwIg5X%2By5mJWrxfOUBXm91QZM6UluUmthntHqplxUml2lciF6wrmdHriI0Wx3xw2hAediLwZRWRkCPzdDswaSvGqkGCfq8VEUsEyPF1O8Qu3O7A09RbRvjuIttsRbT6HHzebsDjcB4%2FJgFFlNv9MnkmsEszodIIY7Oaut2OJcSF68Qx8dgv8tmqEL1gQaaARtp5A%2BN4NzB0lMXxon%2FuxbI8gIYjB9HytGYuusfiPIQcN71kjgnW6VeFOkgh3XcHLvAwMSDPohOADdYQJdF1FtLMZPmslvhZJk2ahkgRvq4HHUoWHRDqTEDDl2mDkfheiDgt8pw340%2FEocuClCuFvboQzb0cwIZgki4KhzlaE6w0InipbVzBfqoK%2FqRH94i0rgokSFeO11iBkp8EdV8cfJo0yD75aE2ZNRvSJ0lZKcBXLaUYmQrCzDT6tDN5SyRqYlWeDLZAg0H4JQ%2BJt6M3atNLE10VSwQsN4Z6r0CBwqzXesHmV%2BBeoyAUri8EyMfi2FowXS5dhd7doo2DVII0V5BAjigP89GEVAtda8b2ehodU4rNaAW%2BdGfzlFkyo89GTlcrHYCLpKD%2BV7yeeHNzLjkp24Uu1Ed6G8%2FF8qjqGRzlbl2H2dzjpMg1KdwsHxOlmJ7GTeZC%2FnesXbeZ6c9OYnuxUc3fmBuFft%2FFf8xMd0s65SXIb%2FgAAAABJRU5ErkJggg%3D%3D"/>
            </tr>
          </table>
          <button onclick="submit()">Submit</button>
        </div>
        <hr/>
        <textarea id="result" readonly="readonly"></textarea>
      </div>
    </div>
    <iframe id="docframe" src="data:text/html,<p>Select a method to view its documentation.</p>"></iframe>
  </div>
  <div style="clear: both; padding: 2px;">
  <aside id="auth" class="box">
    <p>Please log in to your Voxel account</p>
    <form onsubmit="login(); return false"/>
      <input id="name" type="text" placeholder="Username"/>
      <input id="pass" type="password" placeholder="Password"/>
      <p>
        <button type="submit">Log in</button>
      </p>
    </form>
  </aside>
  <script>
    toggleUI(hapi.authenticated);
  </script>
</body>
</html>
